<!--系统设置页面-->
<template>
    <div style="height: 90%;width: 90%;margin:  2.5% auto;background-color: white" v-loading="loading">

        <div style="height: 100px;width: 100%;border-bottom: solid 1px rgba(211,211,211,1)">
            <h1 class="title">发布信息</h1>
        </div>
        <!---->
        <div class="sys_body">
            <div class="switch">
                <h1 class="switch_title">通知校长</h1>
                <el-switch
                        v-model="bossShow"
                        active-color="#13ce66"
                        inactive-color="#ff4949"
                        @change="setBossShow"
                >
                </el-switch>
            </div>
            <div class="switch">
                <h1 class="switch_title">发布排行信息（面向学院）</h1>
                <el-switch
                        v-model="collegeShow"
                        active-color="#13ce66"
                        inactive-color="#ff4949"
                        @change="setCollegeShow"
                >
                </el-switch>
            </div>
            <div class="switch">
                <h1 class="switch_title">{{year}}年所有指标和排行数据</h1>
                <el-button type="primary" size="mini" @click="createNewYearData">生成数据</el-button>
            </div>
        </div>
    </div>
</template>

<script>
    export default {
        name: "sys.vue",
        data() {
            return {

                loading : false,
                bossShow: true, //通知校长
                collegeShow: true,//发布排行信息，面向学院
                year: new Date().getFullYear(),
                width: 60,
                
            }
        },
        methods: {

            /**
             * 设置校长是否可见
             */
            setBossShow: function () {
                let that = this;
                let result = true;
                this.$axios('post','/api/system/setBossIsShow', {
                    is_show: (that.bossShow == true ? 0 : 1)
                },function(res){
                    if(res.data.code != 0){
                        that.bossShow  = false;
                    }
                })
            },

            /**
             * 设置普通院校是否可以查看数据
             */
            setCollegeShow: function () {
                let that = this;
                let result = true;
                this.$axios('post','/api/system/setCollegeIsShow', {
                    is_show: (that.collegeShow == true ? 0 : 1)
                },function(res){
                    if(res.data.code != 0){
                        that.collegeShow  = false;
                    }
                })
            },

            createNewYearData:function () {
                let that = this;
                this.$http.post('/api/index/createNewYearIndex', {
                }).then(res => {
                    if (res.data.code == 0) {
                        that.message(true, '操作成功', 'success')
                    } else {
                        that.message(true, '操作失败', 'error')
                    }
                }).catch(res=>{
                    that.message(true, '操作失败', 'error')
                })
            },
        },
        mounted() {
            let that = this;
            this.$http.get('/api/system/getInfo',{

            })
            .then(res => {
                that.loading = false;
                if (res.data.code == 0) {
                    if(res.data.data['c_s']=="true"){
                        that.collegeShow = true;
                    } else {
                        that.collegeShow = false;
                    }

                    if(res.data.data['b_s']=="true"){
                        that.bossShow = true;
                    } else {
                        that.bossShow = false;
                    }

                    that.year = res.data.data['year'];
                } else {
                    that.message(true, "出错了", 'error');
                }
            }).catch(
                res => {
                    that.message(true, "出错了", 'error');
                }
            )
        }
    }
</script>

<style scoped>
    .title {
        height: 100%;
        line-height: 83px;
        font-size: 25px;
        padding-left: 8%;
    }

    .switch {
        margin-top: 20px;
        display: flex;
        justify-content: space-between;
    }

    .sys_body {
        width: 80%;
        margin: 2.5% auto;
    }

    .switch_title {
        font-size: 20px
    }
</style>
<style>
    .switch .el-switch__core {
        margin: 0;
        position: relative;
        width: 60px !important;
        height: 28px;
        border: 0px solid #dcdfe6;
        outline: 0;
        border-radius: 20px;
        box-sizing: border-box;
        background: #dcdfe6;
        -webkit-transition: border-color .3s, background-color .3s;
        transition: border-color .3s, background-color .3s;
    }

    .switch .el-switch.is-checked .el-switch__core::after {
        left: 100%;
        margin-left: -26px !important;
    }

    .switch .el-switch__core:after {
        position: absolute;
        top: 1px;
        left: 1px;
        border-radius: 100%;
        -webkit-transition: all .3s;
        transition: all .3s;
        height: 25px;
        width: 25px;
        background-color: #fff;

    }

    .switch .el-switch {
        display: -webkit-inline-box;
        display: -ms-inline-flexbox;
        display: inline-flex;
        -webkit-box-align: center;
        -ms-flex-align: center;
        align-items: center;
        position: relative;
        font-size: 14px;
        line-height: 20px;
        height: 20px;
        vertical-align: middle;
        top: 13px;
    }

    .switch .el-button--primary {
        height: 40px;
    }
</style>